<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' 'unsafe-inline'; style-src 'self' 'unsafe-inline'">
  <style>
    body {
      margin: 0;
      padding: 0;
      font-family: Arial, sans-serif;
      overflow: hidden;
      background-color: #2c3e50;
      height: 40px;
      -webkit-user-select: none;
    }
    
    .titlebar {
      display: flex;
      align-items: center;
      height: 40px;
      width: 100%;
      background-color: #2c3e50;
      color: white;
      -webkit-app-region: drag;
    }
    
    .titlebar-buttons {
      display: flex;
      align-items: center;
      height: 100%;
      margin-left: auto;
      padding-right: 8px;
      -webkit-app-region: no-drag;
    }
    
    .title {
      text-align: left;
      font-weight: bold;
      white-space: nowrap;
      margin-left: 20px;
    }
    
    .btn {
      background: none;
      border: none;
      color: white;
      height: 40px;
      padding: 0 12px;
      font-size: 16px;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      -webkit-app-region: no-drag;
    }
    
    .btn:hover {
      background-color: rgba(255, 255, 255, 0.1);
    }
    
    #cache-btn {
      background-color: #3498db;
      padding: 0 15px;
      height: 30px;
      border-radius: 4px;
      margin: 0 10px 0 0;
      font-size: 13px;
    }
    
    #cache-btn:hover {
      background-color: #2980b9;
    }
    
    #close-btn:hover {
      background-color: #e74c3c;
    }
  </style>
</head>
<body>
  <div class="titlebar">
    <div class="title">管理系统</div>
    <div class="titlebar-buttons">
      <button id="cache-btn" class="btn">
        <svg width="14" height="14" viewBox="0 0 24 24" style="margin-right: 5px;">
          <path d="M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z" fill="white"/>
        </svg>
        清除缓存
      </button>
      <button id="min-btn" class="btn">&#8211;</button>
      <button id="max-btn" class="btn">□</button>
      <button id="close-btn" class="btn">✕</button>
    </div>
  </div>

  <script>
    document.addEventListener('DOMContentLoaded', () => {
      const cacheBtn = document.getElementById('cache-btn');
      const minBtn = document.getElementById('min-btn');
      const maxBtn = document.getElementById('max-btn');
      const closeBtn = document.getElementById('close-btn');
      
      cacheBtn.addEventListener('click', async () => {
        try {
          await window.titlebarAPI.clearCache();
        } catch (err) {
          console.error('清除缓存失败:', err);
        }
      });
      
      minBtn.addEventListener('click', () => {
        window.titlebarAPI.minimizeWindow();
      });
      
      maxBtn.addEventListener('click', () => {
        window.titlebarAPI.maximizeWindow();
      });
      
      closeBtn.addEventListener('click', () => {
        window.titlebarAPI.closeWindow();
      });
    });
  </script>
</body>
</html> 